<template>
	<view>
		<scroll-view class="content" scroll-y @scrolltolower="scrollButtonClick" id="height" :style="'height:' + height + 'px ;'">
			<view class="search-input "><label class="iconfont icon-sousuo" /><input type="text" confirm-type="search" v-model="search"
				 class="font-size24" placeholder="搜索" /></view>
			<view class="uni-list-cell uni-list-cell-last" hover-class="uni-list-cell-hover" v-for="(item,index) in privateList"
			 :key="index" @tap="privatedetail(item)">
				<view class="cell-navigate">
					<view class="uni-list-data" v-model="item.F_IsRead" :class="item.F_IsRead==0?'background-color-93D725':'background-color-339AFF'">
						<label class="iconfont icon-sixin icon-label-lin" />
					</view>
					<view class="uni-item-left">
						<view class="overflow-text font-size30 color-3A3A3A">{{item.F_Title}}</view>
						<view class="notify-user-time">
							<view class="color-9A9A9A font-size24">{{item.F_CreatorUserId}}</view>
							<view class="color-9A9A9A font-size24">{{item.F_CreatorTime}}</view>
						</view>
					</view>
				</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	import jnpf from '@/common/js/jnpf.js'
	import helper from '@/common/js/helper.js'
	export default {
		data() {
			return {
				rows: 10,
				page: 1,
				total: 1,
				height: 0,
				privates: [],
				search: ''
			}
		},
		computed: {
			privateList: function() {
				let search = this.search;
				if (search) {
					return this.privates.filter(function(product) {
						return Object.keys(product).some(function(key) {
							return String(product[key]).toLowerCase().indexOf(search) > -1
						})
					})
				}
				return this.privates;
			}
		},
		methods: {
			scrollButtonClick() {
				uni.showLoading({
					title: '加载中...',
					mask: true
				});
				let _this = this;
				if (_this.total > _this.page) {
					_this.page += 1;
					//触发求
					helper.ajax({
						url: '/api/System/Message', //私信
						method: 'GET',
						data: {
							pageSize: _this.rows, //每页行数
							currentPage: _this.page, //当前页
							type: "2"
						},
						success: res => {
							let _total = Math.ceil(res.data.data.pagination.total/res.data.data.pagination.pageSize)
							this.total = _total;
							let privat = res.data.data.list;
							for (let i = 0; i < privat.length; i++) {
								this.privates.push({
									'F_Id': privat[i].id,
									'F_Title': privat[i].title,
									'F_CreatorUserId': privat[i].creatorUserId,
									'F_CreatorTime': helper.toDate(privat[i].creatorTime, 'yyyy-MM-dd HH:mm:ss'),
									'F_IsRead': privat[i].isRead
								})
							}
						}
					});
				}
				uni.hideLoading();
			},
			privatedetail(e) {
				let _privates = this.privates;
				for (let i = 0; i < _privates.length; i++) {
					if (_privates[i].F_Id == e.F_Id) {
						e.F_IsRead = 1;
					}
				}
				uni.navigateTo({
					url: '../privatedetail/privatedetail?privateid=' + e.F_Id,
					success: res => {},
					fail: () => {},
					complete: () => {}
				});
			},
			init() {
				helper.ajax({
					url: '/api/System/Message', //私信
					method: 'GET',
					data: {
						pageSize: this.rows, //每页行数
						currentPage: this.page, //当前页
						type: "2"
					},
					success: res => {
						let _total = Math.ceil(res.data.data.pagination.total/res.data.data.pagination.pageSize)
						this.total = _total;
						let privat = res.data.data.rows;
						for (let i = 0; i < privat.length; i++) {
							this.privates.push({
								'F_Id': privat[i].id,
								'F_Title': privat[i].title,
								'F_CreatorUserId': privat[i].creatorUserId,
								'F_CreatorTime': helper.toDate(privat[i].creatorTime, 'yyyy-MM-dd HH:mm:ss'),
								'F_IsRead': privat[i].isRead
							})
						}
					}
				});
			}
		},
		mounted() {
			let _this = this;
			// 获取设备宽度
			uni.getSystemInfo({
				success: function(res) {
					_this.height = res.windowHeight;
				}
			});
			let search = uni.createSelectorQuery().select(".search-input");
			search.boundingClientRect(data => {
				_this.rows = Math.ceil((_this.height - data.height) / 58)
			}).exec();
			//初始化数据
			_this.init();
		},
	}
</script>

<style>
	.overflow-text {
		width: 99%;
	}

	.uni-list-data {
		width: 66upx;
		height: 66upx;
	}
</style>
